<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>购物车</title>
    <link rel="stylesheet" href="/css/global.css">
    <link rel="stylesheet" href="/css/car.css">
    <link rel="stylesheet" href="/libs/font_2130517_al4ov1s4jw4/iconfont.css">
</head>
<body>
<header></header>
<main>
    <!-- 面包屑导航 -->
    <div class="nav_bar">
        <div class="wrap ban">
            <a href="/">首页</a>
            &gt; <a href="">我的购物车 </a>
        </div>
    </div>

    <!--    购物车列表-->
    <div class="car ban">
        <table id="dataTable">
            <thead>
            <tr class="table-head">
                <td><input type="checkbox" class="checkAll" id="checkAll">全选</td>
                <td>商品名称</td>
                <td>优惠</td>
                <td>数量</td>
                <td>价格</td>
                <td>操作</td>
            </tr>
            </thead>
            <tbody id="car-tbody">

            </tbody>

            <script type="text/html" id="carTemplate">
                {{each car shop}}
                <tr class="car-list" data-id="{{shop.id}}">
                    <td><input type="checkbox" id="checkOne" {{shop.check?'checked':''}} ></td>
                    <td><img src="{{shop.photo[0].url}}">
                        {{shop.title.slice(0,20)}}...
                    </td>
                    <td>{{shop.couponValue}}</td>
                    <td>
                        <div class="buy_num_btn">
                            <button id="reduce-btn">-</button>
                            <input value="{{shop.count}}">
                            <button id="add-btn">+</button>
                        </div>
                        <p>库存{{shop.saleNum}}件</p></td>
                    <td>￥{{(shop.price*shop.count).toFixed(2)}}</td>
                    <td>
                        <div id="delOne">x</div>
                    </td>
                </tr>
                {{/each}}
            </script>


        </table>

        <div class="nothing" id="nothing">
            <span class="iconfont icon-gouwucheman"></span>
            <p>购物车空空的哦~，赶紧<a href="/index.html">去选购</a>吧！</p>
        </div>

    </div>

    <!--    购物车结算-->
    <div class="compute ban" id="compute">
        <div class="compute-left">
            <button id="deleteChecked">删除选中商品</button>
            <a href="/index.html">继续购物</a>
        </div>
        <div class="compute-right ">
            <p>共 <em id="totalNum">3</em> 件商品</p>
            <p>合计：<b>￥ <span id="totalMoney"></span></b></p>
            <button>去结算</button>
        </div>
    </div>
</main>
<footer></footer>
<script src="/libs/require/require.min.js" data-main="/js/car"></script>
</body>
</html>